import { Tabs } from '@aws-amplify/ui-react';
import VitePolyfill from './shared/vite-polyfill.mdx';
import VitePolyfillTS from './shared/vite-polyfill-ts.mdx';

## Vite

When working with a [Vite](https://vitejs.dev) project you must make a few modifications. Please follow the steps below.

<Tabs.Container defaultValue="TypeScript">
  <Tabs.List>
    <Tabs.Item value="TypeScript">TypeScript</Tabs.Item>
    <Tabs.Item value="JavaScript">JavaScript</Tabs.Item>
  </Tabs.List>
  <Tabs.Panel value="TypeScript">
    <VitePolyfillTS />
  </Tabs.Panel>
  <Tabs.Panel value="JavaScript">
    <VitePolyfill />
  </Tabs.Panel>
</Tabs.Container>

## Server-side Rendering (SSR)

Amplify UI components are interactive and designed to work with Client-side rendering (CSR). You must ensure that Amplify UI components are not rendered on the server in SSR-enabled projects.